<template>
 <div>
   <div class="container">
     <div class="Header_text">非常重要！！！请务必填写并核实正确无误</div>
     <el-form ref="form" :model="form" label-width="80px" style="width:80%">
        <el-form-item label="户名：">
          <el-input v-model="form.accountName" :maxlength="10" ref="accountName" style="width:35%"></el-input>
        </el-form-item>
        <el-form-item label="银行：">
          <el-input v-model="form.bankName" :maxlength="10" id="bankName" style="width:35%"></el-input>
        </el-form-item>
        <el-form-item label="开户行：">
          <el-input v-model="form.depositBank" :maxlength="10" id="depositBank" style="width:35%"></el-input>
        </el-form-item>
        <el-form-item label="网点：">
          <el-input v-model="form.latticePoint" :maxlength="10" id="latticePoint" style="width:35%"></el-input>
        </el-form-item>
        <el-form-item label="账号：">
          <el-input v-model="form.accountNumber" id="accountNumber" style="width:35%"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">立即创建</el-button>
        </el-form-item>
      </el-form>
   </div>
 </div>
</template>

<script>
import {mapState} from 'vuex'
export default {
  data() {
    return {
      form: {
        accountName:"",
        bankName: "",
        latticePoint: "",
        accountNumber: "",
        depositBank: "",
        isHaveNews:0 ,  // 0 无数据   1 有数据
      }
    };
  },
  computed:{
      ...mapState(['a'])
  },
  created() {
		this.bankAccount();
  },
  methods: {
    // 获取机构银行信息
    bankAccount(){
      var that = this;
      let organizationId = JSON.parse(localStorage.getItem("organizationIds"))[0];
      this.$axios({
        method: "post",
        url: "/api/goods/xzs/bankAccount.info.get",
        data: {
          organizationId:organizationId,
        },
        transformRequest: [
          function(data) {
            let ret = "";
            for (let it in data) {
              ret += encodeURIComponent(it) + "=" + encodeURIComponent(data[it]) + "&";
            }
            return ret;
          }
        ],
      }).then(res => {
        this.form = Object.assign({},this.form,res.data.data)
        this.form.id!=''?this.isHaveNews = 1:this.isHaveNews = 0
        })
        .catch(err => {
        });
    },
    // 更新  添加 操作
    onSubmit() {
      var that = this;  
      let organizationId = JSON.parse(localStorage.getItem("organizationIds"))[0];
      this.$axios({
        method: "post",
        url: "/api/goods/xzs/bankAccount.info.save",
        // data:{...this.form},
        data:{
          accountName:that.form.accountName,
          bankName:that.form.bankName,
          latticePoint:that.form.latticePoint,
          accountNumber:that.form.accountNumber,
          depositBank:that.form.depositBank,
          organizationId:organizationId,
        },
        transformRequest: [
          function(data) {
            let ret = "";
            for (let it in data) {
              ret += encodeURIComponent(it) + "=" + encodeURIComponent(data[it]) + "&";
            }
            return ret;
          }
        ],
      }).then(res => {
        console.log(res);
        console.log(this.form);
          if(res.data.errorCode==0){
            this.$message({
                showClose: true,
                message: this.isHaveNews == 0?"创建成功":"更新成功",
              type: "success"
            });
          }
        }).catch(err => {
          console.log(err);
        });
    }
  },
  components: {}
};
</script>

<style>
.Header_text{
    width: 100%;
    height: 50px;
    color: red;
    font-size: 18px;
    font-weight: 600;
}
</style>
